<div nz-row class="mb30">
  <button nz-button nzType="primary" nzSize="large" nzShape="circle" (click)="backward()">
    <i nz-icon nzType="arrow-left" nzTheme="outline"></i>
  </button>
</div>

<div nz-row>
  <nz-card [nzBordered]="false" nzTitle="新建项目">
    <form nz-form [formGroup]="validateForm" (ngSubmit)="submitForm(validateForm.value)">
      <nz-form-item>
        <nz-form-label [nzSpan]="7" nzRequired>项目名</nz-form-label>
        <nz-form-control [nzSpan]="12" nzHasFeedback nzValidatingTip="检测中..." [nzErrorTip]="nameErrorTpl">
          <input nz-input formControlName="name" placeholder="请输入项目名"/>
          <ng-template #nameErrorTpl let-control>
            <ng-container *ngIf="control.hasError('required')">
              请输入项目名!
            </ng-container>
            <ng-container *ngIf="control.hasError('duplicated')">
              项目名重复!
            </ng-container>
          </ng-template>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-control [nzOffset]="7" [nzSpan]="12">
          <button nz-button nzType="primary" [disabled]="!validateForm.valid">提交</button>
          <button nz-button (click)="resetForm($event)">重置</button>
        </nz-form-control>
      </nz-form-item>
    </form>
  </nz-card>
</div>
